<%@ page language="java" contentType="text/html; charset=UTF-8"
        pageEncoding="UTF-8"%><!--[if IE 8]> <html lang="en" class="ie8 no-js"> <![endif]-->
<!--[if IE 9]> <html lang="en" class="ie9 no-js"> <![endif]-->
<!--[if !IE]><!-->

<html lang="en" class="no-js" xmlns="http://www.w3.org/1999/xhtml">
<!--<![endif]-->
<!-- BEGIN HEAD -->

<head>
  <meta charset="utf-8" />

  <title>Metronic | Admin Dashboard Template</title>
  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
  <meta content="width=device-width, initial-scale=1" name="viewport" />
  <meta content="" name="description" />
  <meta content="" name="author" />

  <title>页头</title><!-- BEGIN GLOBAL MANDATORY STYLES -->
  <link href="http://fonts.googleapis.com/css?family=Open+Sans:400,300,600,700&subset=all" rel="stylesheet" type="text/css" />
  <link href="../bootstrap/css/font-awesome.min.css" rel="stylesheet" type="text/css" />
  <link href="../bootstrap/css/simple-line-icons.min.css" rel="stylesheet" type="text/css" />
  <link href="../bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
  <link href="../bootstrap/css/uniform.default.min.css" rel="stylesheet" type="text/css" />
  <link href="../bootstrap/css/bootstrap-switch.min.css" rel="stylesheet" type="text/css" /><!-- END GLOBAL MANDATORY STYLES -->
  <!-- BEGIN PAGE LEVEL STYLES -->
  <link rel="stylesheet" type="text/css" href="../bootstrap/css/select2.css" />
  <link rel="stylesheet" type="text/css" href="../bootstrap/css/dataTables.bootstrap.css" /><!-- END PAGE LEVEL STYLES -->
  <!-- BEGIN THEME STYLES -->
  <!-- DOC: To use 'rounded corners' style just load 'components-rounded.css' stylesheet instead of 'components.css' in the below style tag -->
  <link href="../bootstrap/css/components-rounded.css" id="style_components" rel="stylesheet" type="text/css" />
  <link href="../bootstrap/css/plugins.css" rel="stylesheet" type="text/css" />
  <link href="../bootstrap/css/layout.css" rel="stylesheet" type="text/css" />
  <link href="../bootstrap/css/themes/light.css" rel="stylesheet" type="text/css" id="style_color" />
  <link href="../bootstrap/css/custom.css" rel="stylesheet" type="text/css" /><!-- END THEME STYLES -->
  <link rel="shortcut icon" href="../favicon.ico" />
  <style type="text/css">
  .jqstooltip {
        position: absolute;
        left: 0px;
        top: 0px;
        visibility: hidden;
        background: rgb(0, 0, 0) transparent;
        background-color: rgba(0, 0, 0, 0.6);
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000,
                endColorstr=#99000000);
        -ms-filter:
                "progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000, endColorstr=#99000000)";
        color: white;
        font: 10px arial, san serif;
        text-align: left;
        white-space: nowrap;
        padding: 5px;
        border: 1px solid white;
        z-index: 10000;
  }

  .jqsfield {
        color: white;
        font: 10px arial, san serif;
        text-align: left;
  }
  </style>
</head><!-- END HEAD -->

<body class="page-header-fixed page-sidebar-closed-hide-logo page-sidebar-closed-hide-logo">
  <div class="page-container">
    <div class="page_content_wrapper">
      <div class="page_content">
        <div class="row" id="mytest"></div>

        <div class="row">
          <div class="col-md-6">
            <div class="portlet-body">
              <div class="table-scrollable">
                <table class="table table-bordered table-hover">
                  <thead>
                    <tr>
                      <th>#</th>

                      <th>First Name</th>

                      <th>Last Name</th>

                      <th>Username</th>

                      <th>Status</th>
                    </tr>
                  </thead>

                  <tbody>
                    <tr>
                      <td rowspan="2">1</td>

                      <td>Mark</td>

                      <td>Otto</td>

                      <td>makr124</td>

                      <td><span class="label label-sm label-success">测试中文</span></td>
                    </tr>

                    <tr>
                      <td>Jacob</td>

                      <td>Nilson</td>

                      <td>jac123</td>

                      <td><span class="label label-sm label-info">Pending</span></td>
                    </tr>

                    <tr>
                      <td>2</td>

                      <td>Larry</td>

                      <td>Cooper</td>

                      <td>lar</td>

                      <td><span class="label label-sm label-warning">Suspended</span></td>
                    </tr>

                    <tr>
                      <td>3</td>

                      <td>Sandy</td>

                      <td>Lim</td>

                      <td>sanlim</td>

                      <td><span class="label label-sm label-danger">Blocked</span></td>
                    </tr>
                  </tbody>
                </table>
              </div>
            </div>
          </div>
        </div>

        <div class="row">
          <!-- BEGIN EXAMPLE TABLE PORTLET-->
		<div class="col-md-8">
		<div class="portlet box grep-cascade">
		<div class="portlet-body">
              <table id="table-methods-table" class="table table-responsive table-bordered table-hover dataTable no-footer" >
                <thead>
                  <tr role="row">
                    <th class="table-checkbox sorting_disabled" rowspan="1" colspan="1" style="width: 24px;" aria-label="">
                      <div class="checker">
                        <span class=""><input type="checkbox" data-set="#sample_1 .checkboxes" class="group-checkable" /></span>
                      </div>
                    </th>

                    <th class="sorting_disabled" rowspan="1" colspan="1" style="width: 285px;">Item ID</th>

                    <th class="sorting_disabled" rowspan="1" colspan="1" style="width: 469px;">Item Name</th>

                    <th class="sorting_disabled" rowspan="1" colspan="1" style="width: 174px;">Item Price</th>
                  </tr>
                </thead>
              </table>
          <!-- END EXAMPLE TABLE PORTLET-->
          </div>
          </div>
          </div>
        </div>
      </div>
    </div>
  </div><!-- BEGIN JAVASCRIPTS(Load javascripts at bottom, this will reduce page load time) -->

    <input type="button" class="btn btn-default" id="mybutton" value="button" /><!-- BEGIN CORE PLUGINS -->
     <!--[if lt IE 9]>
        <script src="../script/bootstrap/respond.min.js"></script>
        <script src="../script/bootstrap/excanvas.min.js"></script> 
        <![endif]-->
     <script src="../script/jquery/jquery.min.js" type="text/javascript">
</script> <script src="../script/jquery/jquery-migrate.min.js" type="text/javascript">
</script> <!-- IMPORTANT! Load jquery-ui.min.js before bootstrap.min.js to fix bootstrap tooltip conflict with jquery ui tooltip -->
     <script src="../script/jquery/jquery-ui.min.js" type="text/javascript">
</script> <script src="../script/bootstrap/bootstrap.min.js" type="text/javascript">
</script> <script src="../script/bootstrap/bootstrap-hover-dropdown.min.js" type="text/javascript">
</script> <script src="../script/jquery/jquery.slimscroll.min.js" type="text/javascript">
</script> <script src="../script/jquery/jquery.blockui.min.js" type="text/javascript">
</script> <script src="../script/jquery/jquery.cokie.min.js" type="text/javascript">
</script> <script src="../script/jquery/jquery.uniform.min.js" type="text/javascript">
</script> <script src="../script/bootstrap/bootstrap-switch.min.js" type="text/javascript">
</script> <!-- END CORE PLUGINS -->
     <!-- BEGIN PAGE LEVEL PLUGINS -->
     <!-- IMPORTANT! fullcalendar depends on jquery-ui.min.js for drag & drop support -->
     <script src="../script/bootstrap/select2.min.js" type="text/javascript">
</script> <script src="../script/jquery/jquery.dataTables.min.js" type="text/javascript">
</script> <script src="../script/bootstrap/dataTables.bootstrap.js" type="text/javascript">
</script> <!-- END PAGE LEVEL PLUGINS -->
     <!-- BEGIN PAGE LEVEL SCRIPTS -->
     <script src="../script/bootstrap/metronic.js" type="text/javascript">
</script> <script src="../script/bootstrap/layout.js" type="text/javascript">
</script> <script src="../script/bootstrap/table-managed.js" type="text/javascript">
</script> <!-- END PAGE LEVEL SCRIPTS -->
     <script src="../script/test.js" type="text/javascript">
</script> <script type="text/javascript">
                jQuery(document).ready(function() {
                        Metronic.init(); // init metronic core componets
                        Layout.init(); // init layout
                        test();
                });
    </script>
</body>
</html>
